<div class="animated fadeIn">
    <div class="row">
        <div class="col-lg-12">
            <div class="card">
                <div class="card-header">
                    <i class="fas fa-align-justify"></i> 文件管理
                </div>
                <div class="card-body">

                    <div class="alert alert-success" th:if="${message}">
                        <h2 th:text="${message}"/>
                    </div>
                    <!-- 模态框 -->
                    <div class="modal fade" id="uploadModal" th:if="${currentFolder}">
                        <div class="modal-dialog modal-lg">
                            <div class="modal-content">

                                <!-- 模态框头部 -->
                                <div class="modal-header">
                                    <h4 class="modal-title">上传文件</h4>
                                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                                </div>

                                <!-- 模态框主体 -->
                                <div class="modal-body">
                                    <div class="table-responsive" style="text-align: center">
                                        <form method="POST" enctype="multipart/form-data"
                                              th:action="@{'./files/upload'}">
                                            <table class="table table-hover">
                                                <tr>
                                                    <td align="right">需要上传的文件:</td>
                                                    <td><input type="file" name="file"
                                                               class="input custom-file"/></td>
                                                </tr>
                                                <tr>
                                                    <td align="right">访问权限:</td>
                                                    <td>
                                                        <label><input id="shareSetting_PublicMode"
                                                                      name="shareSetting" type="checkbox"
                                                                      value="PublicMode"/>公开访问</label>
                                                        <label><input id="shareSetting_GroupMode"
                                                                      name="shareSetting" type="checkbox"
                                                                      value="GroupMode"/>组内共享</label>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td align="right">共享组:</td>
                                                    <td>
                                                        <select id="shareGroups" name="shareGroups"
                                                                class="select custom-select"
                                                                multiple="multiple">
                                                            <option th:each="entry : ${groupMap}"
                                                                    th:value="${entry.key}"
                                                                    th:text="${entry.value}">共享组
                                                            </option>
                                                        </select>
                                                    </td>
                                                </tr>
                                            </table>
                                            <input type="hidden" id="folderId" name="folderId"
                                                   th:value="${currentFolder.id}"/>
                                            <input type="submit" value="上传" class="btn btn-success"/>
                                        </form>
                                    </div>
                                </div>
                                <!-- 模态框底部 -->
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-secondary" data-dismiss="modal">关闭
                                    </button>
                                </div>

                            </div>
                        </div>
                    </div>

                    <div th:if="${currentFolder}">
                        <a th:href="@{'/files/folder@'+${currentFolder.parentId}}"
                           th:text="@{'返回上级目录'}"></a>

                        <button type="button" class="btn btn-primary" data-toggle="modal"
                                data-target="#uploadModal">
                            <i class="fas fa-cloud-upload-alt"></i>上传文件
                        </button>

                    </div>

                    <table class="table table-responsive-sm table-bordered table-striped table-hover table-sm">
                        <thead>
                        <tr>
                            <th>文件名</th>
                            <th>文件类型</th>
                            <th>文件长度</th>
                            <th>上传日期</th>
                            <th>操作</th>
                        </tr>
                        </thead>

                        <tbody>
                        <tr th:each="folder : ${folders}">
                            <td>
                                <i th:if="${folder.childrenCount>0}" class="fas fa-folder"></i>
                                <i th:if="${folder.childrenCount==0}" class="far fa-folder"></i>
                                <a th:href="@{'/files/folder@'+${folder.id}}" th:text="${folder.path}"/>
                            </td>
                            <td colspan="3">文件夹</td>
                            <td>
                                <div class="input-group">
                                    <a th:href="@{'./files/zip-resource/'+${folder.id}}" class="btn btn-dark">
                                        <i class="fas fa-cloud-download-alt"></i>
                                    </a>
                                </div>
                            </td>
                        </tr>
                        <tr th:each="file : ${files}">
                            <form th:action="@{/files/deleteFile}" th:method="DELETE">
                                <td>
                                    <a th:href="@{'/files'+${file.linkPrefix}+${file.id}}">
                                        <i th:class="${file.iconClass}"></i>
                                        <span th:text="${file.filename}"></span>
                                    </a>
                                </td>
                                <td th:text="${file.type}">文件类型</td>
                                <td th:text="${#numbers.formatInteger(file.length,3,'COMMA')}">文件大小</td>
                                <td th:text="${#dates.format(file.uploadDate,'yyyy-MM-dd HH:mm:ss')}">上传日期</td>
                                <td>
                                    <div class="input-group">
                                        <input type="hidden" id="fileId" name="fileId"
                                               th:value="${file.id}"/>
                                        <input type="hidden" id="folderId" name="folderId"
                                               th:value="${currentFolder.id}"/>
                                        <input th:if="${file.deleteAuthorization}" type="submit"
                                               value="&#xf2ed" class="btn btn-danger far fa-trash-alt"/>
                                        <a th:href="@{'./files/download/'+${file.id}}" class="btn btn-dark">
                                            <i class="fas fa-cloud-download-alt"></i>
                                        </a>
                                    </div>
                                </td>
                            </form>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
            <!--/.row-->
        </div>
    </div>
</div>
